<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    用户名:
    <input type="text" id="name"><br>
    &nbsp;&nbsp;&nbsp;密码:
    <input type="text" id="password"><br>
    &nbsp;&nbsp;&nbsp;生日:
    <input type="text" id="born"><br>
    手机号:
    <input type="text" id="number"><br>
    <input type="button" value="查询" id="search">
    <script>
        function $(id){
            return document.getElementById(id);
        }
        function checkName(obj){
            var reg=/^(0?[1-9])|(1[0-2])$/;
            if(!reg.test($("name").value)){
                $(obj).style.color="red";
                $(obj).value="输入错误,请重新输入!";
                return false;
            }
            return true;
        }
        function checkPassword(obj){
            var reg=/(?=.*[A-Z]+)(?=.*[a-z]+)(?=.*[0-9]+)[a-zA-Z0-9]{8,20}/;
            if(!reg.test($("password").value)){
                $(obj).style.color="red";
                $(obj).value="输入错误,请重新输入!";
                return false;
            }
            return true;
        }
        function checkBorn(obj){
            var reg=/^\d{4}(0?[1-9])|(1[0-2])$/;
            if(!reg.test($("born").value)){
                $(obj).style.color="red";
                $(obj).value="输入错误,请重新输入!";
                return false;
            }
            return true;
        }
        function checkNumber(obj){
            var reg=/^1[3-9][0-9]{9}$/;
            if(!reg.test($("number").value)){
                $(obj).style.color="red";
                $(obj).value="输入错误,请重新输入!";
                return false;
            }
            return true;
        }
        $("search").onclick=function(){
            console.log("ture");
            return checkName("name") && checkPassword("password") && checkBorn("born") && checkNumber("number");
        }
        function focus(obj){
        $(obj).onfocus=function(){
            $(obj).style.color="black";
            $(obj).value="";
        }
    }
    focus("name");
    focus("password");
    focus("born");
    focus("number");
    </script>
</body>
</html>